<template>
	<!-- 发现页 -->
	<view class="content">
		<view class="swiper">
			<u-swiper :list="imgUrlList" @change="e => current = e.current" :autoplay="true">
				<view slot="indicator" class="indicator">
					<view class="indicator__dot"
					v-for="(item, index) in imgUrlList" :key="index"
					:class="[index === current && 'indicator__dot--active']">
					</view>
				</view>
			</u-swiper>
		</view>
		
		<view class="recommend">
			<span>推荐岗位</span>
			<view class="img">
				<view class="left">
					<image src="https://vkceyugu.cdn.bspapp.com/VKCEYUGU-8568e76c-23c5-4d05-bd27-7ff891e61576/095f1811-7175-4196-b4be-1dcf61394aaf.png" mode="scaleToFill"></image>
				</view>
				<view class="right">
					<image src="https://vkceyugu.cdn.bspapp.com/VKCEYUGU-8568e76c-23c5-4d05-bd27-7ff891e61576/461db27c-628f-4548-895a-0e4593de93a9.png" mode="scaleToFill"></image>
				</view>
			</view>
		</view>
		
		<view class="excellent">
			<span>精品岗位</span><br>
			<view class="img">
				<view class="left">
					<image src="https://vkceyugu.cdn.bspapp.com/VKCEYUGU-8568e76c-23c5-4d05-bd27-7ff891e61576/61f7ddaa-5115-4928-bf99-12151c7fb59a.png" mode="scaleToFill"></image>
					<image src="https://vkceyugu.cdn.bspapp.com/VKCEYUGU-8568e76c-23c5-4d05-bd27-7ff891e61576/8acd263a-46df-464f-af5a-5d1bb1a1a9b7.png" mode="scaleToFill"></image>
				</view>
				<view class="right">
					<image src="https://vkceyugu.cdn.bspapp.com/VKCEYUGU-8568e76c-23c5-4d05-bd27-7ff891e61576/1cc605dd-8f6e-4424-94f2-dee3886945a1.png" mode="scaleToFill"></image>
				</view>
			</view>
		</view>
	</view>
</template>

<script>
	export default {
		data() {
			return {
				imgUrlList:[
                    'https://cdn.uviewui.com/uview/swiper/swiper1.png',
                    'https://cdn.uviewui.com/uview/swiper/swiper2.png',
                    'https://cdn.uviewui.com/uview/swiper/swiper3.png',
                ],
				current:0
			}
		},
		onLoad() {
			// uni.request({
			// 	url:'https://apidev.xuniuwang.com/app/find',
			// 	data:{
			// 	    "source": 0
			// 	},
			// 	success:res=>{
			// 		console.log('success',res);
			// 	}
				
			// })
			this.$store.dispatch('initDic').then(()=>{
				let source=NaN
				//#ifdef H5
				source=1
				//#endif
				//#ifdef MP-WEIXIN
				source=2
				//#endif
				//#ifdef MP-ALIPAY
				source=3
				//#endif
				this.$http.request({
					url:'/app/find',
					data:{
						source:source
					}
				}).then((result)=>{
					let res=result.data
					console.log('响应结果',res);
				})
			})
			
			
			
			
		},
		methods: {
			
		}
	}
</script>

<style scoped lang="scss">
	.content{
		background-color: #ffffff;
		min-height: 130vh;
		padding: 1rpx 0;
	}
	
	.indicator {
		@include flex(row);
		justify-content: center;

		&__dot {
			 height: 6px;
			 width: 6px;
			 border-radius: 100px;
			 background-color: rgba(255, 255, 255, 0.35);
			 margin: 0 5px;
			 transition: background-color 0.3s;
	
			&--active {
				 background-color: #ffffff;
			 }
		}
	}
	.swiper{
		position: relative;
		margin: auto;
		padding-top: 30rpx; 
		width: 94%;
	}
	
	
	
	
	.recommend{
		margin-top: 20rpx;
		width: 100%;
		font-size: 16px;
		font-family: PingFang SC-Medium, PingFang SC;
		font-weight: 500;
		color: #000000;
	}
	.recommend span{
		margin-left: 30rpx;
	}
	.recommend .img{
		margin: 20rpx 0;
		display: flex;
		flex-wrap: wrap;
		justify-content: center;
	}
	.recommend .left image:nth-of-type(1){
		width: 328rpx;
		height: 260rpx;
		border-radius: 8px 8px 8px 8px;
	}
	.recommend .right image:nth-of-type(1){
		width: 328rpx;
		height: 260rpx;
		border-radius: 8px 8px 8px 8px;
	}
	
	.excellent{
		font-size: 16px;
		font-family: PingFang SC-Medium, PingFang SC;
		font-weight: 500;
		color: #000000;
	}
	.excellent span{
		margin-left: 30rpx;
	}
	.excellent .img{
		margin: 20rpx 0;
		display: flex;
		flex-wrap: wrap;
		justify-content: center;
	}
	.left{
		width: 340rpx;
	}
	.left image:nth-of-type(1){
		width: 328rpx;
		height: 240rpx;
		border-radius: 8px 8px 8px 8px;
	}
	.left image:nth-of-type(2){
		width: 328rpx;
		height: 374rpx;
		border-radius: 8px 8px 8px 8px;
	}
	
	.right{
		width: 340rpx;
	}
	.right image:nth-of-type(1){
		width: 328rpx;
		height:340rpx;
		border-radius: 8px 8px 8px 8px;
	}
	
</style>
